let href = location.href;
var pageid = 1;
var pagemax;

function getUrldata(url) {
    url = decodeURI(url)
    // console.log(queryString)
    let reg = /^[^\s]+\?([^&\s\d]+=[^\s]+)*/
    let match = reg.exec(url)[1];
    if (!match) { //表示没匹配到
        console.warn("没有匹配到相应的query参数")
        return null
    }
    var queryArr = match.split("&");
    // console.log(queryArr);
    var queryobj = {};
    queryArr.forEach(item => {
        var itemarr = item.split("=")
        queryobj[itemarr[0]] = itemarr[1];
    })
    return queryobj;
}
var qr = getUrldata(href);
console.log(qr);

var htmlnav = `
        <a href="./index.html">首页</a>&nbsp;>&nbsp;<a href="./category.html">全部分类</a>&nbsp;>&nbsp;<a href="#">${qr.title}</a>
        <button>筛选</button>`;

$("nav").html(htmlnav)
// console.log(pageid);
changecontent();

function buttonChangeColor() {
    if (pagemax <= 1) {
        $(".changepage button").css("color", "#cccccc")
    } else {
        if (pageid < pagemax && pageid > 1) {
            $(".changepage button").css("color", "#333333")
        }
        switch (pageid) {
            case 1:
                $(".propage").css("color", "#cccccc");
                $(".nextpage").css("color", "#333333");
                break;
            case pagemax:
                $(".propage").css("color", "#333333");
                $(".nextpage").css("color", "#cccccc");
                break;

        }

    }
}

function changecontent() {
    $.ajax({
        url: "http://chst.vip:1234/api/getproductlist",
        type: "Get",
        data: {
            categoryid: qr.categoryid,
            pageid: pageid

        },
        success(sus) {
            // console.log(sus);
            pagemax = Math.ceil(sus.totalCount / sus.pagesize)
            // console.log(pagemax);
            var htmlchangepage = ""
            for (var i = 1; i <= pagemax; i++) {
                htmlchangepage += `
                <option value=${i} pageid=${i}>${i}/${pagemax}</option>
                
                `
            }
            // console.log(pageid);
            $("main #page").html(htmlchangepage);

            buttonChangeColor();


            $($("main #page").children()[pageid - 1]).siblings().removeAttr("selected").end().attr("selected", "selected")
            var htmlproduct = "";
            //  console.log(sus.result);
            sus.result.forEach(item => {
                htmlproduct += `
                 <div productId=${item.productId} categoryid=${item.categoryId} class="productItem">
                    <div class="left">
                        ${item.productImg}
                    </div>
                    <div class="right">
                        <h3>${item.productName}</h3>
                        <b>${item.productPrice}</b>
                        <p><span>${item.productQuote}</span><span>${item.productCom}</span></p>
                    </div>
 
                 </div>
                 
                 `

            })
            $("main .product").html(htmlproduct);

        }
    }).then(res => {

        $("main button").click(function () {

            if ($(this).attr("class") === "propage") {
                pageid--;
                if (pageid < 1) {
                    pageid = 1;
                    return;
                }
                // console.log(pageid,"上一页")
            } else if ($(this).attr("class") === "nextpage") {
                pageid++;
                if (pageid > pagemax) {
                    pageid = pagemax;
                    return;
                }
                console.log(pageid, "下一页");
            }
            $("main button").unbind("click");
            $("#page").unbind("change");
            changecontent()
        })

        $("#page").change(function () {
            pageid = Number($(this).val())
            $("#page").unbind("change");
            $("main button").unbind("click");
            changecontent()

        })

        //点击商品跳转到商品详情页
        $("main .product").on("click", ".productItem", function () {

            let title = qr.title;
            let productid = $(this).attr("productid");

            location.href = `/pages/productlist.html?productid=${productid}&title=${title}`
        })
    })
}